import React from 'react'
import { createContext } from 'react'
const { Provider, Consumer } = createContext()
function ComA() {
  return (
    <div>
      this is ComA <ComC></ComC>
    </div>
  )
}

function ComC() {
  return (
    <div>
      this is ComC
      <Consumer>
        {(value) => (
          <span>{value}</span>
        )}
      </Consumer>
    </div>
  )
}

class App extends React.Component {
  state = {
    message: 'this is message',
  }
  render() {
    return (
      <Provider value={this.state.message}>
        <div>
          <ComA></ComA>
        </div>
      </Provider>
    )
  }
}
export default App
